*{
    margin: 0;
    padding: 0; list-style: none;
}
.box{
    width: 100%; height: 100%; overflow: hidden;
    .car{
        width: 100%; height: calc(100% - 50px);
        display: flex; flex-direction: column;  overflow-y: scroll;
        .headeImg{
            width: 100%; height: 164.5px; margin-bottom: 10px;
            position: relative;
            >img{
                width: 100%; height: 100%;
            }
            .count{
                position: absolute;
                right: 20px;
                bottom: 8px;
                color: #fff;
                font-size: 12px;
                // padding: 2px 10px;
                width: 74.15px;  height: 18px;
                text-align: center;
                background-color: red;
                border-radius: 6px;
                -webkit-border-radius: 6px;
                -moz-border-radius: 6px;
                -ms-border-radius: 6px;
                -o-border-radius: 6px;
                background-color: rgba(0,0,0,.6);
    }
        }
        .dijia{
            width: 100%; height: 50px; 
            display: flex; align-items: center; justify-content: space-around;
            .dL{
                display: flex; flex-direction: column;
                >span:first-child{
                    font-size: 20px; color: red;
                }
                >span:nth-child(2){
                    font-size: 12px;color: #999; 
                }
            }
            .dR{
                >button{
                    background-color: #00afff;
                    border: none;
                    color: #fff;
                    padding: 8px 45px;
                    border-radius: 5px ;
                    -webkit-border-radius: 5px ;
                    -moz-border-radius: 5px ;
                    -ms-border-radius: 5px ;
                    -o-border-radius: 5px ;
                }
            }
            
        }
        .year{
            width: 100%; height: 46px; display: flex; padding: 13px 0;
            align-items: center; flex-direction: row;
            >span{
                padding: 0 10px;
                &.active{
                    color: #00afff;
                }
            }
        }
        .list{
            >ul{
                width: 98%; min-height: 100px; margin: 15px  0 ; margin-left: 5px;
                >li{
                    margin: 10px 0 ;
                }
                >li:first-child{
                    color: #999; background: #f4f4f4; font-size: 12px; 
                    font-weight: 300;
                }
                // >li:nth-child(2){

                // }
                >li:nth-child(3){
                    color: #999; font-size: 12px;font-weight: 300;
                }
                >li:nth-child(4){
                    display: flex; justify-content: flex-end; align-items: center;
                    
                    >span:first-child{
                        color: #999;  font-size: 12px;
                    }
                    >span:nth-child(2){
                        color: red; font-size: 16px; margin: 0 5px; font-weight: 300;
                    }
                }
                >li:nth-child(5){
                    // margin-bottom: -12px;
                    border: none;
                    border-top: 1px solid #eee;
                    width: 100%; height: 30px;
                    >button{
                        width: 100%; height: 100%; border: none;color: #00afff;
                        font-size: 16px; background-color: #fff;
                    }
                }
            }
            
        }
        
    }
    footer{
        width: 100%; height: 50px; 
        // position: fixed; bottom: 0;
        >button{
            width: 100%; height: 100%; border: none;
            background-color: #00afff; color: #fff;

        }
    }
}